<template>
    <div class="content">
        <div class="goods-table">
            <ListTable :status="status" :goodsList="state.goodsList" />
        </div>
        <div class="pagination zw-pagination">
            <Pagination
                :total="state.totalCount"
                :page-size="state.pageSize"
                :current-page="state.pageNum"
                @sizeChange="sizeChange"
                @pageChange="pageChange" />
        </div>
    </div>
</template>

<script setup>
import FilterForm from './filter.vue';
import ListTable from './table.vue';
import Pagination from '@/components/Pagination.vue';

import { computed, reactive, inject } from 'vue';

const bus = inject('bus');

const props = defineProps({
    status: {
        type: String,
        default: ''
    }
});

const status = computed(() => {
    return props.status;
});

const state = reactive({
    pageNum: 1,
    pageSize: 10,
    totalCount: 0,
    goodsList: []
});

const search = res => {
    state.goodsList = res.data.list || [];
    state.totalCount = res.data.totalCount;
};

const sizeChange = pageSize => {
    state.pageSize = pageSize;
    setTimeout(() => {
        bus.emit('reloadGoodsList');
    });
};

const pageChange = pageNum => {
    state.pageNum = pageNum;
    setTimeout(() => {
        bus.emit('reloadGoodsList');
    });
};
</script>

<style lang="scss" scoped>
.content {
    .goods-table {
    }
}
</style>
